<script setup>
import {reactive} from "vue"

const props = defineProps({
    elem: {
        type: Object,
        default: () => {
            return {
                styleConfig: {},
                dataConfig: {},
                children: []
            }
        }
    },
})

</script>

<template>
    <div class="Flex1" :style="elem.styleConfig">
        <template v-for="(child, i) in elem.children" :key="i">
            <component :is="child.type" :elem="child"></component>
        </template>
    </div>
</template>

<style lang="scss" scoped>
.Flex1 {
    display: inline-flex;
    position: relative;
    page-break-inside: avoid;
}
</style>